import React, { useEffect, useState } from 'react'
import { useDispatch, useSelector } from "react-redux"
import { GETLIST, ALLSTATE, GETINDEX } from "../types/store.d"
import { NavBar, Search, Sidebar, Image, ProductCard, Tag, Grid, Button } from 'react-vant';
interface DATATYPE {

}
function Leftclassify(props: any) {
  const dispatch = useDispatch()
  const [active, setActive] = useState(0);
  const [value, setValue] = useState('');
  console.log(props.dataprops);
  
  const changeindex = (v: number) => {
    setActive(v);
    console.log(v);
    dispatch({
      type: GETINDEX,
      payload: v
    })
  }
  return (
    <div>
      <Sidebar
        value={active}
        onChange={(v) => changeindex(v)}
      >
        {
          props.dataprops &&  props.dataprops.map((item:any, index1:number) => {
            return <Sidebar.Item title={item.name} key={index1} />
          })
        }
      </Sidebar>
    </div>
  )
}

export default Leftclassify